<template>
	<view class="search_bar flex align-center just-sb">
		<input v-model="value" class="fs22 c333 mr28" type="text" :placeholder="placeholder" @blur="handleblur" @confirm="handleConfirm">
		<uni-icons class="icon flex-sk0" type="search"></uni-icons>
	</view>
</template>

<script>
	export default {
		name:"search-bar",
		props: {
			placeholder: {
				type: String,
				default: '输入关键词搜索'
			},
		},
		data() {
			return {
				value:''
			};
		},
		methods: {
			handleConfirm() {
				this.$emit('ok',this.value)
			},
			handleblur(){
				this.$emit('blur',this.value)
			}
		},
		
	}
</script>

<style lang="less">
.search_bar{
	padding: 0 28rpx;
	width: 100%;
	height: 61.11rpx;
	background: #ffffff;
	border: 1.39rpx solid #d8d8d8;
	border-radius: 31.94rpx;
	input{
		line-height: 61.11rpx;
		height: 61.11rpx;
		flex-grow: 1;
	}
}
</style>